<template>
  <div class="base-container" id="main">
    <t-form ref="form" :data="queryParams" label-width="80" @submit="()=>{this.pagination.current=1;this.queryParams.pageNum=1;this.getList()}" @reset="()=>{this.queryParams.pageNum=1;this.queryParams.pageNum=1;this.getList()}">
      <t-row style="border-bottom: 1px solid #E5E6EB;margin-bottom: 10px">
        <t-col :span="11" class="query-form-inline">
          <t-form-item label="项目名称" name="projectName">
            <t-input
              v-model="queryParams.projectName"
              clearable
              placeholder="请输入项目名称"
              style="width: 240px"
            />
          </t-form-item>
        </t-col>
        <t-col :span="1" class="operation-container">
          <t-button theme="primary" type="submit"> 查询</t-button>
          <t-button theme="default" variant="outline" type="reset">重置</t-button>
        </t-col>
      </t-row>
    </t-form>
    <t-tabs  @change="(val)=>{queryParams.reviewType=val;getList();}" v-model="queryParams.reviewType" style="margin-bottom: 10px">
      <t-tab-panel :key="item.id" :value="item.id" v-for="(item) in site_tag === 'jtt' ? queryTypeOptions : queryTypeOptions.filter(item => ['1', '2', '3'].includes(item.id))" :destroyOnHide="false">
        <template #label>
          <t-badge :count="item.total" size="small">
            {{ item.name }}
          </t-badge>
        </template>
      </t-tab-panel>
    </t-tabs>
    <t-table rowKey="index" size="small" :data="data" :columns="columns" hover :pagination="pagination"
             :loading="dataLoading"  :hideSortTips="true">
         <template #[`projectName`]="{ row }">
        <t-link v-if="row.version === '2024'" @click="dialog.header=row.projectName;dialog.objId=row.id;dialog.open_item_detail=true" hover="color" theme="primary">{{row.projectName}}</t-link>
        <t-link v-else @click="dialog.header=row.projectName;dialog.objId=row.id;dialog.open_detail=true" hover="color" theme="primary">{{row.projectName}}</t-link>
      </template>
      <template #[`subjectClassification`]="{row}">
        {{ row.subjectClassification | filterByDict(dict.type.subject_classification) }}
      </template>
      <template #[`projectType`]="{row}">
        {{ row.projectType | filterByDict(dict.type.project_type) }}
      </template>
      <template #op="{row}">
        <t-button v-if="row.version === '2024'" @click="dialog.header=row.projectName;dialog.objId=row.id;dialog.open_item_detail=true" size="small" variant="text" class="t-button-link">
          <t-icon name="info-circle" slot="icon"/>
          详情
        </t-button>
        <t-button v-else @click="dialog.header=row.projectName;dialog.objId=row.id;dialog.open_detail=true" size="small" variant="text" class="t-button-link">
          <t-icon name="info-circle" slot="icon"/>
          详情
        </t-button>
      </template>
    </t-table>
    <project-detail-dialog :header="dialog.header" :objId="dialog.objId" :visible.sync="dialog.open_detail" v-if="dialog.open_detail"></project-detail-dialog>
    <item-detail-dialog :header="dialog.header" :objId="dialog.objId" :visible.sync="dialog.open_item_detail" v-if="dialog.open_item_detail"></item-detail-dialog>
  </div>
</template>

<script>
import ProjectDetailDialog from "@/pages/kjxm/pm/components/project-detail-dialog.vue";
import ItemDetailDialog from "@/pages/kjxm/pm/components/item-detail-dialog.vue";

export default {
  dicts:["subject_classification","project_type"],
  components: {
    ProjectDetailDialog,
    ItemDetailDialog
  },
  data() {
    return {
      site_tag: import.meta.env.VITE_SITE_TAG,
      queryTypeOptions: [
        {
          id: "4",
          name: '第一次立项评审',
          total: 0,
        },
        {
          id: "5",
          name: '第二次立项评审',
          total: 0,
        },
        {
          id: "1",
          name: '立项评审',
          total: 0,
        },
        {
          id: "2",
          name: '大纲评审',
          total: 0,
        },
        {
          id: "3",
          name: '验收评审',
          total: 0,
        }
      ],
      tabDefaultValue:"",
      queryParams:{
        pageNum:1,
        pageSize:10,
        reviewType:"4",
        projectName:"",
      },
      pagination: {
        current: 1,
        pageSize: 10,
        total: 0,
        showPageSize: true,
        pageSizeOptions: [10,20,30],
        showFirstAndLastPageBtn: false,
        onChange: (pageInfo) => {
          Object.assign(this.pagination,pageInfo)
          this.queryParams.pageNum = pageInfo.current || 1;
          this.queryParams.pageSize = pageInfo.pageSize;
          this.getList()
        },
      },
      dialog:{
        row:{},
        objId: null,
        header:"",
        open_detail: false,
        open_item_detail:false,
      },
      dataLoading: false,
      columns: [
        {
          colKey: "projectName",
          title: "项目名称",
          align: "center",
        },
        {
          colKey: "projectLeaderName",
          title: "负责人",
          align: "center",
          width: 100
        },
        {
          colKey: "declareDeptName",
          title: "承担单位",
          align: "center",
          width: 180,
        },
        {
          colKey: "adviceFunding",
          title: "建议经费总概算",
          align: "center",
          width: 140
        },
        {
          colKey: "subsidyFunding",
          title: import.meta.env.VITE_SITE_TAG==='jtt'?"厅拨经费":`集团补助经费`,
          align: "center",
          width: 140
        },
        {
          colKey: "projectCategoryName",
          title: "计划类别",
          align: "center",
          width: 120
        },
        {
          colKey: "subjectClassification",
          title: "学科分类",
          align: "center",
          width: 100
        },
        {
          colKey: "projectType",
          title: "项目类型",
          align: "center",
          width: 120
        },
        // {
        //   colKey: "createTime",
        //   title: "申报时间",
        //   align: "center",
        //   width: 200
        // },
        {
          colKey: "op",
          title: "操作",
          align: "center",
          width: 120
        },
      ],
      data: []
    }
  },
  created() {
    this.refreshBadge()
    this.queryParams.reviewType = this.queryTypeOptions[0].id
    this.getList()
  },
  methods: {
    refreshBadge() {
      this.queryTypeOptions.forEach(item => {
        this.queryParams.reviewType = item.id
        this.$api.kjxm.review.reviewListByReviewType(this.queryParams).then(response=>{
          item.total = response.total
        }).catch(e=>{
          this.$message.error(e.toString())
        })
      })
    },
    // 获取接口数据
    getList(){
      this.dataLoading = true
      return this.$api.kjxm.review.reviewListByReviewType(this.queryParams).then(response=>{
        this.pagination.total = response.total
        this.data = response.rows
        this.dataLoading = false
      }).catch(e=>{
        this.dataLoading = false
        this.$message.error(e.toString())
      })
    },
  }
}
</script>

<style lang="less" scoped>

</style>

